<template>
    <div class="timing">
      <!-- 表格 -->
      <admincentertb ref="httbRef" width="250" :btn-is-show="btnIsShow" :table-col="tabUserList" :table-data="tableUserData"
      @getDataDetileInfo="getDataDetileInfo"
       @deleteSelectData="deleteSelectData" @refresh="getUserList">
       <!-- <template v-slot:autoBtn="slotProps">
            <el-button slot="autoBtn" type="text" @click="staging(slotProps.data)">暂存</el-button>
        </template> -->
        </admincentertb>
      <!-- 分页 -->
      <div style="text-align:right;margin-top:10px;">
        <el-pagination
          :current-page="page"
          :page-sizes="[10, 20, 30, 40]"
          :page-size="size"
          layout="total, sizes, prev, pager, next, jumper"
          :total="total"
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
        />
      </div>
    </div>
  </template>
  
  <script>
  import { activitigetDeployList,fromsave, fromremove,getColumPlace,activitidefinition} from '@/api/home_/adminCenter'
  import jkdialog from './fromEdit'
  import request from '@/utils/request'
  export default {
    components: {jkdialog},
    data() {
      return {
        place:"",
        isrequireobj:{},
        selectObjOptions:null,
        lcListOptions:[],
        tabUserList2:[],
        elradioOptionsa:[],
        elradioOptionsb:[],
        leftRadio:'',
        sourceList2:[],
        btnIsShow: {
          operate: true,
          detile: false,
          example:true,
          outParamsBind:false,
          update:false,
          del: false
        },
        btnIsShow2: {
          operate: false,
          detile: false,
          example:false,
          update:false,
          del: false
        },
        title: '创建流程实例',
        rules: {},
        userId: '',
        addParms: [],
        addParms2: [],
        tableUserData: [],
        fullscreenLoading:false,
        tabUserList: [
          {
            key: 'deployName',
            title: '事项名称'
          },
          {
            key: 'formName',
            title: '表单标识'
          },
          {
            key: 'definitionKey',
            title: '事项标识'
          },
          {
            key: 'createTime',
            title: '创建时间'
          }
        ],
        total: 0,
        size: 10,
        page: 1,
        total2: 0,
        size2: 10,
        page2: 1,
        addOptopnsListObj:[],
        noChangeList:[],
        changeList:[]
       
      }
    },
    created() {
  
    },
    mounted() {
      this.$nextTick(() => {
        this.getUserList()
      })
    },
    methods: { 

      //绑定外部参数
        outParamsBindParentFun(v){
          this.selectObjOptions = v
          this.$router.push({
              path:'/bindOut/bindOutParm',
              query:{paramsObj:v}})
        },
        handleSizeChange2(v) {
          this.page2 = 1
            this.size2 = v
            this.queryTableList()
        },
        handleCurrentChange2(v) {
            this.page2 = v
            this.queryTableList()
        },
        queryTableList(){
          request({
              url: '/ht-bpmn/basicData/libraryList',
              method: 'post',
              data:{
                pgIndex:this.page2,
                pgSize:this.size2,
                place:this.place
              }
            }).then(res => {
              if (res.code == 200) {
                this.lcListOptions = res.data.records
                this.total2 = res.data.total
              } else {
                that.$notify.error({
                  title: '错误',
                  message: res.msg
                })
              }
            })
        },
        querySxTj(v){
          this.place = v.place
        
          this.queryTableList()
        },
       
        deleteRow(v){
           let lcLiionstr = JSON.parse(JSON.stringify(this.lcListOptions))
           let i = -1
           lcLiionstr.forEach((item,index)=>{
              if(v.jkCount ==item.jkCount){
                i = index
              }
           })
           lcLiionstr.splice(i,1)
           this.lcListOptions = JSON.parse(JSON.stringify(lcLiionstr))
        },
        resetForm(){
            // this.inputName = ""
            this.lcListOptions = []
        },
        insertData(){///////////////////////////
          let obj = {}
          this.addOptopnsListObj.forEach((item,index)=>{
            obj[item.key] = ""
          })
          obj.place = this.selectObjOptions.place
          obj.jkCount = this.lcListOptions.length+1
          this.lcListOptions.push(obj)
        },
        setKeyObj(v){
          for(let i=0;i<v.length;i++){
            if(v[i].children&&v[i].children.length>0){
                this.setKeyObj(v[i].children)
            }else{
              let key = v[i].jsonKey
              this.isrequireobj[key] = v[i].required
              this.addOptopnsListObj.push({
                key:key
              })
            }
          }
        },
      //创建任务获取表头
        createPrelcObj(v){
          this.selectObjOptions = JSON.parse(v)
          this.place = this.selectObjOptions.place
          getColumPlace(JSON.parse(v).place).then(res=>{
              this.addOptopnsListObj = []
              this.tabUserList2 = res.data
              this.setKeyObj(this.tabUserList2)
          })
          //bug定时器跳转
         setTimeout(()=>{
           this.$router.push({
              path:'/taskcenterPage/taskcenpage',
              query:{paramsObj:v,isShowObj:JSON.stringify({
                liucheng:'n',
                chuangjian:'y',
                yijian:'n'
              })}})
         },500)
        },
        deleteSelectData(v) {
            const ids = [v.id] 
            fromremove(ids).then(res => {
            if (res.code == 200) {
                this.$message.success(res.msg)
                this.getUserList()
            } else {
                this.errorDialog(res.msg)
            }
            })
        },
        commitFromData() {
            fromsave(this.ruleForm).then(res => {
                if (res.code == 200) {
                this.getUserList()
                } else {
                this.errorDialog(res.msg)
                }
            })
        },
        handleSizeChange(v) {
          this.page = 1
            this.size = v
            this.getUserList()
        },
        handleCurrentChange(v) {
            this.page = v
            this.getUserList()
        },
        // 获取用户列表
        getUserList() {
            this.$refs.httbRef.isShowLoading(true)
            activitigetDeployList({
                'page': this.page,
                'limit': this.size
            }).then(res => {
                this.tableUserData = res.data.deploymentList
                this.total = Number(res.data.total)
                this.$refs.httbRef.isShowLoading(false)
            })
        }
        }
    }
  </script>
  
  <style lang="scss" scoped>
    @import "~@/assets/styles/auto.scss";
        .info{
          margin-top: 20px;
        }
        .info>p{
          padding:4px 0;
          margin-left:80px;
          display: flex;
          flex-direction: row;
          justify-content: space-between;
        }
        .info>p:nth-child(1){
          color: #474747;
          font-weight: bold;
          background: #f1f4f7;
          padding-left: 0px;
        }
        .info>p>label{
          display: inline-block;
          width:35%;
        }
        .info>p>span{
          color:#494949;padding: 2px 4px;
          border-radius: 2px;font-size: 12px;
          background: #f0f0f0;
        }
      .ztree {
          margin-left:80px;
          border:1px solid #efefef;
          padding: 4px;
          border-radius: 2px;
          min-height: 270px;
          height: 300px;
          overflow-y: scroll;
      }
      .resoceDialog{
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: space-between;
      }
      .resoceDialog>div>p{
        color: #464646;
        padding: 10px 0;
        font-weight: bold;
        // background: #f1f4f7;
        margin-left:26px;
        padding-left:0px;
        margin-bottom: 5px;
        text-align: right;
      }
        >>>.jsoneditor-poweredBy {
          display: none !important;
        }
  
        .addPs{
          display: flex;
          flex-direction: row;
          margin-bottom: 10px;
          >div{
            width:50%
          }
          span{
            display: inline-block;
            width: 10%;
          }
        }
        .autoClass{
          display: flex;
          flex-direction: row;
          flex-wrap: wrap;
        }
        .autoClass .el-form-item{
          width:50%;
        }
        .addcs{
          display: flex;
          flex-direction: row;
          margin-bottom: 10px;
        }
        .addcs2 .el-select {
          display: inline-block;
          width: 240px;
        }
        .autoInput{
          display: inline-block;
          width: 70%;
        }
        .infoTitle{
          border-bottom:1px solid #e5e5e5;
          margin-bottom: 30px;
          position: relative;
        }
        .infoTitle>span{
          position: absolute;
          left: 20px;
          background: #fff;
          width:80px;
          top:-15px;
          height:30px;
          text-align: center;
          line-height: 30px;
        }
          .el-select{
             width:100%;
          }
          .timing{
            background:#fff;
            padding:20px 10px;
          }
        </style>
  